JavaScript - lexical environment

Followings comprise lexical environment

• (변수 이름: 변수 값) mapped(binding) record (a.k.a environmental record). Takes real memory storage.
• Reference to outer environment.

global object

When object property can be accessible globally.

• 플랫폼에 상관없이 존재함 (globalThis, 이 이름은 전역 스코프에서 this가 참조하는 객체이기 때문에 이렇게 지어짐)
• 전역 객체의 속성 중 일부는 특정 플랫폼에서만 참조 가능
  • window는 브라우저에 있고 Web Workers와 Node.js에 없음.
  • self는 Node.js에 없음
  • global은 Node.js에만 있음

👀 참조 [[JavaScript - Host Objects vs Native Objects]]

브라우저에서 globalThis는 전역 객체를 직접적으로 참조하지 않음. iframe이 사용되는 예시를 통해 살펴보자:

• iframe의 src 값이 바뀌면 새로운 전역 객체가 만들어짐
• 그러나 globalThis는 항상 같은 값을 가져야하고, iframe 바깥에서도 확인 가능해야함.

1. iframe이 로딩되면 iframe에 포함된 문서의 전역 객체를 firstGlobalThis, 전역 객체의 속성(Array)을 firstArray에 저장하고. iframe의 src 값을 바꾼다.
2. 바뀐 주소의 iframe이 로딩되면 iframe에 포함된 문서의 전역 객체를 secondGlobalThis, 전역 객체의 속성(Array)를 secondArray에 저장하고 위와 비교해본다.
3. globalThis는 같음. Array는 다름

Why?

• location changes, Window changes
• WindowProxy forwards object to current Window object

브라우저에서 globalThis는 WindowProxy임

global environment

• Environment for the "outermost" scope

• has 2 environmental records for variables:

  • object environment record :

• https://exploringjs.com/deep-js/ch_global-scope.html#lexical-environments